import React,{useState,useEffect} from 'react'
import { useParams } from 'react-router';
import './Add.css';

//添加画作页面
const Udpainting = () => {
    const arr = ['画作id: ','作者id: ','画作名称: ','画作流派: ','画作风格: ','画作主题: ','画作朝代: '];
    const [paint,setPaint] = useState({});
    const {id} = useParams();
    useEffect(() => {
        fetch("https://api.52h5.xyz:3001/paint?pId="+id)
        .then(res=>res.json())
        .then(res=>{
            const{pId,aId,pName,pSchools,pStyle,pTheme,pDynasty,pInformation} = res.data[0];
            const arr1 = [pId,aId,pName,pSchools,pStyle,pTheme,pDynasty,pInformation]
            console.log(res.data[0]);
            setPaint({'图片内容':pInformation});
            arr.map((item,index)=>setPaint({...paint,[item]:arr1[index]}))
        })
    }, [])
    return (
        <div className="board">
            <div className="info">
                <h3>修改画作</h3>
                <form action = "https://api.52h5.xyz:3001/udpaint" method = "post" enctype="multipart/form-data">
                <div className="addList">
                    <ul>
                        {
                            arr.map((item,index)=>{
                                return(
                                    <li>
                                        <span>{item}</span>
                                        <input name={item}  value={paint[item]} onChange={(e)=>setPaint({...paint,[item]:e.target.value})}></input>
                                    </li>
                                )
                            })
                        }
                        <li>
                            <input type="file" name="file"></input>
                        </li>
                    </ul>
                    <li id="content">
                        <span>图片内容</span>
                        <textarea name='图片内容' value={paint['图片内容']} onChange={(e)=>setPaint({...paint,'图片内容':e.target.value})}></textarea>
                        <input type="submit" value="提交"/>
                    </li>
                </div>
                </form>
            </div>
        </div>
    )
}
export default Udpainting
